Supabase is an open source Firebase alternative. Start your project with a Postgres database, Authentication, instant APIs, Edge Functions, Realtime subscriptions, and Storage.

Supabase

Is there an easy way to upload a file from <input type="file"> to a bucket?

I have this code in one of my test apps.
```
const inputElement = document.getElementById("input1");
inputElement.addEventListener("change", handleFiles, false);
function handleFiles() {
   const fileList = this.files;
   console.log(fileList)
   const avatarFile = fileList[0]
   const { data, error } =  supabase
       .storage
       .from('test')
       .upload('public/avatar1.png', avatarFile, {
           cacheControl: '3600',
           upsert: false
       })
}
```

Is there then a way to get the url to that file in the bucket?

Depends on if it is a public bucket or not.
This is for non-public: https://supabase.com/docs/reference/javascript/storage-from-createsignedurl
But you should read thru the storage commands on those pages.
You will also to make sure your storage object policies are set properly to upload and get a signed url.

from.getPublicUrl() will be off to the left

I don't know if I do this right, but I have tried

```js
var {banner_public_url, error} = supabase
        .storage
        .from('song-icon')
        .getPublicUrl(uuid); // Please don't comment on the code

console.log(banner_public_url)
```

and it just prints "undefined"

the url is in publicURL key of returned object.  So you need to use that, or publicURL:banner_public_url

Also is uuid your path name for the file?

When you use {x,y} = x and y must match the name of the returned object keys.  It is not positional.   What I showed was how to alias the publicURL name to something else.

If you did obj = Supabase…. there and console log obj you will see the structure.